const webpack = require("webpack");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const { defineConfig } = require("@vue/cli-service");

const ReplaceAttributeWebpackPlugin = require("./plugin/replace-attribute-webpack-plugin");
const JsonpDecoratePlugin = require("./plugin/jsonp-decorate-plugin");

module.exports = defineConfig({
  transpileDependencies: true,
  devServer: {
    port: 3072, // 默认端口
  },
  configureWebpack: {
    optimization: {
      splitChunks: {
        chunks: "all",
        minSize: 0,
        minChunks: 1,
      },
    },
  },
  chainWebpack: (config) => {
    if (process.env.NODE_ENV === "production") {
      config.plugin("replace-attribute").use(ReplaceAttributeWebpackPlugin, [
        {
          href: (key, value) => ["data-" + key, "%relation_path%" + value],
          src: (key, value) => ["data-" + key, "%relation_path%" + value],
        },
      ]);

      // 处理JSONP方法，加载文件添加前缀
      config.plugin("jsonp-decorate").use(JsonpDecoratePlugin);

      config
        .plugin("limit-chunk-count")
        .use(webpack.optimize.MinChunkSizePlugin, [
          {
            minChunkSize: 1024 * 150,
          },
        ]);
    }
    config.plugin("define").use(webpack.DefinePlugin, [
      {
        BUILD_ENV: process.env.BUILD_ENV, // 打包0测试环境 1生产环境
      },
    ]);
  },
});
